<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link
	href="${pageContext.request.contextPath }/admin/assets/css/bootstrap.min.css"
	rel="stylesheet" />
<link rel="stylesheet"
	href="${pageContext.request.contextPath }/admin/css/style.css" />
<link
	href="${pageContext.request.contextPath }/admin/assets/css/codemirror.css"
	rel="stylesheet">
<link rel="stylesheet"
	href="${pageContext.request.contextPath }/admin/assets/css/ace.min.css" />
<link rel="stylesheet"
	href="${pageContext.request.contextPath }/admin/assets/css/font-awesome.min.css" />
<script
	src="${pageContext.request.contextPath }/admin/assets/js/jquery.min.js"></script>
<script
	src="${pageContext.request.contextPath }/admin/assets/js/jquery-2.1.1.min.js"></script>
<script
	src="${pageContext.request.contextPath }/admin/assets/js/bootstrap.min.js"></script>

<script type="text/javascript">
	window.jQuery
			|| document
					.write("<script src='"+${pageContext.request.contextPath }+"/admin/assets/js/jquery-2.0.3.min.js'>"
							+ "<"+"/script>");
</script>
<script type="text/javascript">
	if ("ontouchend" in document)
		document
				.write("<script src='"+${pageContext.request.contextPath }+"/admin/assets/js/jquery.mobile.custom.min.js'>"
						+ "<"+"/script>");
</script>
<script src="../assets/js/bootstrap.min.js"></script>
<script src="../assets/js/typeahead-bs2.min.js"></script>
<!-- page specific plugin scripts -->
<script
	src="${pageContext.request.contextPath }/admin/assets/js/jquery.dataTables.min.js"></script>
<script
	src="${pageContext.request.contextPath }/admin/assets/js/jquery.dataTables.bootstrap.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/admin/js/H-ui.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/admin/js/H-ui.admin.js"></script>
<script
	src="${pageContext.request.contextPath }/admin/assets/layer/layer.js"
	type="text/javascript"></script>
<script
	src="${pageContext.request.contextPath }/admin/assets/laydate/laydate.js"
	type="text/javascript"></script>
<title>人员列表</title>
</head>

<body>
	<div class="page-content clearfix">
		<div id="Member_Ratings">
			<div class="d_Confirm_Order_style">
				<br>
				<!---->
				<div class="border clearfix">
					<span class="l_f">
						<button class="btn btn-xs btn-info" data-toggle="modal"
							data-target="#myModal1">
							<i class="icon-plus"></i>添加部门
						</button>
					</span> <span class="r_f">共：<b>${departsSize }</b>条
					</span>
				</div>
				<!---->
				<div class="table_menu_list">
					<table class="table table-striped table-bordered table-hover"
						id="sample-table">
						<thead>
							<tr>
								<th width="100">ID</th>
								<th width="100">部门名称</th>
								<th width="100">部门介绍</th>
								<th width="100">操作</th>
							</tr>
						</thead>
						<tbody>
							<s:iterator value="#request.departs">
								<tr>
									<td>${departId }</td>
									<td>${departName }</td>
									<td>${departRemark }</td>
									<td class="td-manage">
										<button class="btn btn-xs btn-info" data-toggle="modal"
											data-target="#myModal">
											<i class="icon-edit bigger-120"></i>
										</button> <a title="删除" href="deleteDepart?departId=${departId }"
										onclick="javascript:return confirm('您确认要删除');"
										class="btn btn-xs btn-warning"><i
											class="icon-trash  bigger-120"></i></a>
									</td>
									<td></td>
								</tr>
							</s:iterator>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>

	<!-- 添加模态框 -->
	<div class="modal fade" id="myModal1" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×</button>
					<h4 class="modal-title">添加部门信息</h4>
				</div>
				<form action="${pageContext.request.contextPath }/addDepart"
					method="post">
					<div class="modal-body">
						<div class="planel_boxs">
							<div class="row">
								<div class="row_line col-md-6 col-sm-6 col-xs-12">
									<label>部门名称:</label> <input type="text"
										class="form-controls content" name="departName" />
								</div>
								<div class="row_line col-md-6 col-sm-6 col-xs-12">
									<label>部门介绍:</label> <input type="text"
										class="form-controls identify" name="departRemark" />
								</div>
							</div>
						</div>
					</div>
					<div class="modal-footer text-center">
						<input type="submit" id="submit" class="btn btn-default btn_blue"
							value="添加">
						<button type="button" class="btn btn-default btn_red"
							data-dismiss="modal">取消</button>
					</div>
				</form>
			</div>
		</div>
	</div>

	<!-- 修改模态框 -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×</button>
					<h4 class="modal-title">修改部门信息</h4>
				</div>
				<form action="${pageContext.request.contextPath }/updateDepart"
					method="post">
					<div class="modal-body">
						<div class="planel_boxs">
							<div class="row">
								<div class="row_line col-md-6 col-sm-6 col-xs-12">
									<label>部门编号:</label> <input type="text"
										class="form-controls content" name="departId" id="id" />
								</div>
								<div class="row_line col-md-6 col-sm-6 col-xs-12">
									<label>部门名称:</label> <input type="text"
										class="form-controls content" name="departName" id="name" />
								</div>
								<div class="row_line col-md-6 col-sm-6 col-xs-12">
									<label>部门介绍:</label> <input type="text"
										class="form-controls identify" name="departRemark" id="remark" />
								</div>
							</div>
						</div>
					</div>
					<div class="modal-footer text-center">
						<input type="submit"
							onclick="javascript:return confirm('您确认要修改');"
							class="btn btn-default btn_blue" value="修改" />
						<button type="button" class="btn btn-default btn_red"
							data-dismiss="modal">取消</button>
					</div>
				</form>
			</div>
		</div>
	</div>

	<script>
		/*用户-编辑*/
		$('#myModal').on('show.bs.modal', function(event) {
			alert(1)
			var btnThis = $(event.relatedTarget); //触发事件的按钮
			var modal = $(this); //当前模态框
			var modalId = btnThis.data('id'); //解析出data-id的内容 
			var content = btnThis.closest('tr').find('td').eq(0).text();
			modal.find('#id').val(content);
			var content = btnThis.closest('tr').find('td').eq(1).text();
			modal.find('#name').val(content);
			var content = btnThis.closest('tr').find('td').eq(2).text();
			modal.find('#remark').val(content);
			var content = btnThis.closest('tr').find('td').eq(3).text();

		});
	</script>
</body>
</html>
<script type="text/javascript">
	jQuery(function($) {
		var oTable1 = $('#sample-table').dataTable({
			"aaSorting" : [ [ 0, "desc" ] ],//默认第几个排序
			"bStateSave" : true,//状态保存
			"aoColumnDefs" : [ {
				"bVisible" : false,
				"aTargets" : [ 4 ]
			} //控制列的隐藏显示
			]
		});
		$('table th input:checkbox').on(
				'click',
				function() {
					var that = this;
					$(this).closest('table').find(
							'tr > td:first-child input:checkbox').each(
							function() {
								this.checked = that.checked;
								$(this).closest('tr').toggleClass('selected');
							});

				});
		$('[data-rel="tooltip"]').tooltip({
			placement : tooltip_placement
		});
		function tooltip_placement(context, source) {
			var $source = $(source);
			var $parent = $source.closest('table')
			var off1 = $parent.offset();
			var w1 = $parent.width();

			var off2 = $source.offset();
			var w2 = $source.width();

			if (parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2))
				return 'right';
			return 'left';
		}
	})

	
</script>